<template>
	<view>
		<cu-custom bgColor="bg-blue-light" 
		title="工程领域拖欠农民工工资"></cu-custom>
		<view class="bg-blue-light" style="height: 150rpx;border-radius: 0 0 50rpx 50rpx;">
		</view>
		<view class="card" style="height: 368rpx;margin-top: -150rpx;">
			<view class="head">
				请填写拖欠工资单位相关信息
			</view>
			<zh-input v-model="entryname" type="text" label="工程项目名称"
			labelAlign="left" inputAlign="right" :required="true" 
			placeholder="请输入项目名称"></zh-input>
			<zh-input v-model="aae006" type="text" label="工程项目地址"
			labelAlign="left" inputAlign="right" :required="true" 
			placeholder="请输入项目地址"></zh-input>
			<zh-picker
				pickerRef="area"
				label="所在地区"
				labelAlign="left"
				justifyContent="space-between"
				mode="selector" 
				:options="areaData"
				rightIconClass="text-gray"
				:value="area"
				placeholder="请选择所在地区"
				themeColor="#FC7983"
				:required="true"
				@pickerChange="onAreaChange($event)"
				ref="area"
			></zh-picker>
		
		</view>
		<view class="card" style="height: 620rpx;">
			<view class="head">
				请填写相关项目信息(可参照维权公示牌)
			</view>
			<zh-input v-model="generalconame" type="text" label="施工单位名称"
			labelAlign="left" inputAlign="right" :required="true" 
			placeholder="请输入承包单位名称"></zh-input>
			<zh-input v-model="teamleader" type="text" label="班组长姓名"
			labelAlign="left" inputAlign="right" :required="true" 
			placeholder="请输入班组长姓名"></zh-input>
			<zh-input v-model="teamleadercall" type="text" label="班组长电话"
			labelAlign="left" inputAlign="right" :required="true" 
			placeholder="请输入班组长电话"></zh-input>
			<zh-input v-model="aab013" type="text" label="施工单位项目负责人姓名"
			labelAlign="left" inputAlign="right"  
			placeholder="请输入项目负责人姓名"></zh-input>
			<zh-input v-model="aab013call" type="text" label="施工单位项目负责人电话"
			labelAlign="left" inputAlign="right" 
			placeholder="请输入项目负责人电话"></zh-input>
			<zh-input v-model="aab004" type="text" label="建设单位名称"
			labelAlign="left" inputAlign="right" :required="false" 
			placeholder="请输入单位名称"></zh-input>
		</view>
		<view class="card" style="height: 370rpx;">
			<view class="head">
				请填写反映人相关信息
			</view>
			<zh-text v-model="resname" type="text" label="反映人姓名"
			labelAlign="left" inputAlign="right" :required="true" 
			placeholder="请输入反映人姓名"></zh-text>
			<zh-text v-model="resphone" type="text" label="反映人电话"
			labelAlign="left" inputAlign="right" :required="true" 
			placeholder="请输入反映人电话"></zh-text>
			<zh-text v-model="residcardo" type="text" label="反映人身份证号码"
			labelAlign="left" inputAlign="right" :required="true" 
			placeholder="请输入身份号码"></zh-text>
		</view>
		<view class="card" style="height: 370rpx;">
			<view class="head">
				请填写欠薪相关信息
			</view>
			<zh-input v-model="arrearnum" type="text" label="欠薪人数" :rightText="{text:'人'}"
			labelAlign="left" inputAlign="right" :required="true" 
			placeholder="请输入欠薪人数"></zh-input>
			<zh-input v-model="arrearamount" type="text" label="欠薪金额" :rightText="{text:'元'}"
			labelAlign="left" inputAlign="right" :required="true" 
			placeholder="请输入欠薪金额"></zh-input>
			<zh-picker
				pickerRef="accidentDate"
				mode="date"
				startYear="2000" 
				label="欠薪开始时间"
				themeColor="#FC7983"
				labelAlign="left"
				rightIconClass="text-gray"
				justifyContent="space-between"
				:value="arreartime1"
				fields="day"
				ref="accidentDate"
				:required="true"
			   @pickerChange="PickerChange1"
			></zh-picker>
			<zh-picker
				pickerRef="accidentDate"
				mode="date"
				startYear="2000" 
				label="欠薪结束时间"
				themeColor="#FC7983"
				labelAlign="left"
				rightIconClass="text-gray"
				justifyContent="space-between"
				:value="arreartime2"
				fields="day"
				ref="accidentDate"
				:required="true"
			   @pickerChange="PickerChange2"
			></zh-picker>
		</view> 
		<view class="buttonParent">
			<view class="button flex flex-direction"
			style="padding-top: 50rpx;margin-left: 40rpx;">
				<button class="cu-btn shadow margin-tb-sm lg bg-blue-light"
				 style="background-color: #1388ED;" @tap="up">上一步</button>
			</view>
			<view class="button flex flex-direction" 
			style="padding-top: 50rpx;margin-left: 40rpx;">
				<button class="cu-btn shadow margin-tb-sm lg bg-blue-light"
				 style="background-color: #1388ED;" @tap="xiayi">下一步</button>
			</view>
		</view>
		<w-picker
			:visible.sync="areaVisible"
			mode="selector"
			:options="areaData"
			:themeColor="userType=='20'?'#0081ff':'#f37b1d'"
			@confirm="onAreaChange($event)"
			:defaultProps="{label:'areaName',value:'areaCode'}"
			ref="area"
		></w-picker>
	</view>
</template>

<script>
	import store from "@/store"
	import util from '@/common/util/util.js';
	import reqConfig from '@/common/config/reqConfig.js';
	import api from '@/api/society/home/nobackpay.js';
	export default {
		data() {
			return {
				areaData:[
							{dictKey:'330702',dictValue:'婺城区'},
							{dictKey:'330704',dictValue:'开发区'},
							{dictKey:'330703',dictValue:'金东区'},
							{dictKey:'330723',dictValue:'武义县'},
							{dictKey:'330726',dictValue:'浦江县'},
							{dictKey:'330727',dictValue:'磐安县'},
							{dictKey:'330781',dictValue:'兰溪市'},
							{dictKey:'330782',dictValue:'义乌市'},
							{dictKey:'330783',dictValue:'东阳市'},
							{dictKey:'330784',dictValue:'永康市'}],
				entryname:'',
				aae006:'',
				aab301: '',
				aab004:'',
				aab013:'',
				aab013call:'',
				generalconame:'',
				branchconame:'',
				teamleader:'',
				teamleadercall:'',
				resname: store.state.hh_user.fullName,
				resphone: store.state.hh_user.cellphone,
				residcard: store.state.hh_user.idcard,
				arrearnum:'',
				arrearamount:'',
				arreartime:'',
                arreartime1: '',
				arreartime2: '',
				areaVisible:false,
				area:store.state.hh_areaName,
				residcardo:''
			}
		},
		methods: {
			indexs: function() { 
				if(this.residcard.length >= 10){
					let str = this.residcard
					this.residcardo = str.replace(/(\w{2})\w*(\w{2})/,'$1************$2');
					console.log(this.residcard)
				}
			},
			onAreaChange(e){
				console.log(e)
				if(e){	
					this.area=e.key
					this.aab301=e.value
					console.log(this.aab301)
					console.log(this.aab301)
					console.log(this.aab301)
					
					console.log(this.area)
				}
			},
			areaChangeTap(){
				this.areaVisible = true
			},
			PickerChange1(e) {
				this. arreartime1= e.value
			},
			PickerChange2(e) {
				this. arreartime2= e.value
			},
			up: function(){
						
						let a = this.$Router.back(1)
						        if (a == undefined) {
						        //重新定向跳转页面
						          this.$Router.replaceAll({ name:'fieldSelection'})
						        }
								else{
									this.$Router.back(1);
								}},
			xiayi: function(){
				
				if(this.entryname== "" || this.entryname==null){
					uni.showToast({
						title: '请输入工程项目名称',
						icon: 'none',
						duration:2000
					});
					return
				}
				if(this.aae006== "" || this.aae006==null){
					uni.showToast({
						title: '请输入工程项目地址',
						icon: 'none',
						duration:2000
					});
					return
				}
				if(this.aab301== "" || this.aab301==null){
					uni.showToast({
						title: '请输入所在地区',
						icon: 'none',
						duration:2000
					});
					return
				}
				if (!this.$validate.isPhone(this.resphone)) {
				  uni.showToast({
				    icon: 'none',
				    title: '请输入正确的反映人电话',
					duration:2000
				  })
				  return
				}
				if(this.generalconame== "" || this.generalconame==null){
					uni.showToast({
						title: '请输入施工单位名称',
						icon: 'none',
						duration:2000
					});
					return
				}
				if(this.teamleader== "" || this.teamleader==null){
					uni.showToast({
						title: '请输入班组长姓名',
						icon: 'none',
						duration:2000
					});
					return
				}
				if(this.teamleadercall== "" || this.teamleadercall==null){
					uni.showToast({
						title: '请输入班组长电话',
						icon: 'none',
						duration:2000
					});
					return
				}
				
				
				// 	uni.showToast({
				// 		title: '请输入所在地区',
				// 		icon: 'none',
				// 		duration:2000
				// 	});
				// 	return
				// }
				if(this.resname== "" || this.resname==null){
					uni.showToast({
						title: '请输入反映人姓名',
						icon: 'none',
						duration:2000
					});
					return
				}
				if(this.resphone== "" || this.resphone==null){
					uni.showToast({
						title: '请输入反映人电话',
						icon: 'none',
						duration:2000
					});
					return
				}
				if(this.residcard== "" || this.residcard==null){
					uni.showToast({
						title: '请输入反映人身份证号',
						icon: 'none',
						duration:2000
					});
					return
				}
				if(this.arrearnum== "" || this.arrearnum==null){
					uni.showToast({
						title: '请输入欠薪人数',
						icon: 'none',
						duration:2000
					});
					return
				}
				if(this.arrearamount== "" || this.arrearamount==null){
					uni.showToast({
						title: '请输入欠薪金额',
						icon: 'none',
						duration:2000
					});
					return
				}
                if(this.arreartime1== "" || this.arreartime1==null){
					uni.showToast({
						title: '请输入欠薪开始时间',
						icon: 'none',
						duration:2000
					});
					return
				}
				if(this.arreartime2== "" || this.arreartime2==null){
					uni.showToast({
						title: '请输入欠薪结束时间',
						icon: 'none',
						duration:2000
					});
					return
				}
					if(!this.$validate.isIdcard(this.residcard)){
						uni.showToast({
						  icon: 'none',
						  title: '请输入正确的身份证号',
						  duration:2000
						})
						return
					}
					console.log(111);
					this.$Router.push({
						name: 'projectForm2',
						params:{
							entryname:this.entryname,
							aab004:this.aab004,
							aab013:this.aab013,
							aab013call:this.aab013call,
							aab301:this.aab301,
							aae006:this.aae006,
							generalconame:this.generalconame,
							branchconame:this.branchconame,
							teamleader:this.teamleader,
							teamleadercall:this.teamleadercall,
							resname:this.resname,
							resphone:this.resphone,
							residcard:this.residcard,
							arrearnum:this.arrearnum,
							arrearamount:this.arrearamount,
							arreartime:this.arreartime1+this.arreartime2,
							
						}
					});
					// this.$Router.push({
					// 	name: 'notProjectForm2'
					// }); 
					},
					
			},
			mounted(){
			           //自动加载indexs方法
			           this.indexs();
			       }
			}
</script>

<style>
	page{
		background-color: #F6F6F6;
	}
	.card{
		background: #FFFFFF;
		border-radius: 20rpx;
		width: 690rpx;
		margin-left: 30rpx;
		margin-top: 20rpx;
	}
	.head{
		height: 87rpx;
		width: 690rpx;
		line-height: 87rpx;
		font-family: 'PingFangTC-Medium';
		font-size: 30rpx;
		font-weight: bold;
		color: #333333;
		letter-spacing: 0;
		padding-left: 30rpx;
		border-bottom: 1px solid #DFDFDF;
	}
	.yesOrNo{
		display:flex;
		height: 91rpx;
		padding-top: 15rpx;
		padding-left: 130rpx;
	}
	.buttonParent{
		margin-top: 20rpx;
		width: 690rpx;
		display: flex;
		margin-bottom: 70rpx;
	}
	.button{
		margin-top: 20rpx;
		width: 320rpx;
	}
</style>
